<template>
  <view class="download-container">
    <button @click="downloadImage">下载图片</button>
    <image v-if="imagePath" :src="imagePath" mode="widthFix"></image>
  </view>
</template>

<script>
export default {
  data() {
    return {
      imagePath: ''
    }
  },
  methods: {
    downloadImage() {
      uni.showLoading({ title: '下载中...' })
      uni.downloadFile({
        url: 'https://cdn.pixabay.com/photo/2025/11/05/20/57/monastery-9939590_1280.jpg',
        success: (res) => {
          if (res.statusCode === 200) {
            this.imagePath = res.tempFilePath
            uni.hideLoading()
            console.log('下载成功，临时路径：', res.tempFilePath)
          }
        },
        fail: (err) => {
          uni.hideLoading()
          console.error('下载失败：', err)
        },
        progress: (progressRes) => {
          console.log('下载进度：', progressRes.progress, '%')
        }
      })
    }
  }
}
</script>

<style scoped>
.download-container {
  padding: 20rpx;
}
image {
  width: 100%;
  margin-top: 20rpx;
}
</style>